<template>
    <div @click="pathPush">
        <div class="detailItem">
            <div class="imgtext">
                <img :src="detailitem.img" alt="" style="width:100%;">
                <span class="video"><van-icon name="thumb-circle" />123</span>
                <span class="comment"><van-icon name="video" />{{detailitem.commentlen}}</span>
            </div>
            <p>{{detailitem.name}}</p>
        </div>
    </div>
</template>
<script>
export default {
    props:[
        'detailitem'
    ],
    data(){
        return{}
    },
    methods:{
        pathPush(){
            if(this.$route.path != `/article/${this.detailitem.id}`){
                this.$router.push(`/article/${this.detailitem.id}`)
            }
        }
    }
}
</script>
<style lang="scss">
.detailItem{
    p{
        font-size:3.333vw;
    }
    .imgtext{
        position: relative;
        font-size:3.333vw;
        .video{
            position: absolute;
            left: 0;
            bottom: 0;
        }
        .comment{
            position: absolute;
            left: 12.667vw;
            bottom: 0;
        }
    }
}
</style>